<!DOCTYPE html>
<html lang="en">
<head>
    <title>功能演示</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- <meta ng-include="'head.html'"> -->
    <style type="text/css">

    </style>
    <script src="../lib/js/jquery.min.js" type="text/javascript"></script>
    <script src="../js/build.js" type="text/javascript"></script>
    <script src="../js/public.js" type="text/javascript"></script>
    <script src="../lib/js/maptalks.min.js" type="text/javascript"></script>
</head>
<body class="flat-blue">
<div class="app-container" ng-app="myApp" ng-controller="myCtrl">
<div class="row content-container">
<div ng-include="'menus.html'" onload="loadReady()"></div>
<div class="container-fluid">
<div class="side-body padding-top" id="main" style="padding-top: 55px;">
    <!------------------Main---------------->
    <div style="min-height:850px" id="view"></div>

    <!------------------End Main---------------------->
</div>  <!--End side-body-->
</div>  <!--End container-fluid-->
</div>  <!--End content-container-->
<div ng-include="'footer.html'"></div>
</div>  <!--End app-container-->

<script language="javascript">
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
        // loadCtlBase($scope);
    });

    drawMap();

    function drawMap(){
        var map = new maptalks.Map('view', {
            center:     [103.047527, 30.015917],
            zoom:  6,
            pitch : 45,
            baseLayer : new maptalks.TileLayer('base',{
                'urlTemplate': 'http://wprd0{s}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&style=7',
                'subdomains': ['1','2','3','4'],
                'cssFilter': 'sepia(90%) invert(90%)'   //sepia     grayscale
            })
        });

    }

    

</script>

</body>
</html>
